module.exports = function initEventHandlers(that) {
    let dragging = false;
    let lastX = -1, lastY = -1;
    let currentAngle = that.config.currentAngle;

    that.canvas.addEventListener('mousedown', function(e) {
        let event = e ? e : window.event;
        let x = event.clientX, y = event.clientY;
        let rect = event.target.getBoundingClientRect();
        if(rect.left <= x && x < rect.right && rect.top <= y && y < rect.bottom) {
            lastX = x; lastY = y;
            dragging = true;
        }
    });

    that.canvas.addEventListener('mouseup', function(e) {
        dragging = false;
    });

    that.canvas.addEventListener('mousemove', function(e) {
        let event = e ? e : window.event
        let x = event.clientX, y = event.clientY;
        if(dragging) {
            let zoomFactor = Math.log(that.currentdis + 2) / 1.63 - 0.4 + that.currentdis / 20;
            let factor = 100 / that.canvas.height * zoomFactor;
            let dx = factor * (x - lastX);
            let dy = factor * (y - lastY);

            currentAngle[0] = Math.max(Math.min(currentAngle[0] + dy, 85.0), -85.0);
            currentAngle[1] = currentAngle[1] + dx;
            // deal with modelMatrix
            // that.setModelNormal();
            
            that.dealLngLat();

            // that.updateSence();
        }
        lastX = x;lastY = y;
    });

    if (typeof document.onmousewheel == "undefined") {
        // for firefox wheel
        that.canvas.addEventListener('wheel', (e) => {
            let event = e ? e : window.event
            if (event.deltaY < 0) {
                startZoom.call(that, 0.5);
            } else {
                startZoom.call(that, -0.5);
            }
            that.zoomToDis();
        });
    } else {
        // for chrome wheel
        that.canvas.addEventListener('mousewheel', (e) => {
            let event = e ? e : window.event
            if (event.wheelDelta > 0) {
                startZoom.call(that, 0.5);
            } else {
                startZoom.call(that, -0.5);
            }
            that.zoomToDis();
        });
    }

    // just for test
    document.addEventListener('keydown', function(e) {
        let event = e ? e : window.event;
        let dx = 0, dy = 0;
        switch(event.keyCode) {
            case 37:
                dx = -10;
                break;
            case 38:
                dy = 10;
                break;
            case 39:
                dx = 10;
                break;
            case 40:
                dy = -10;
                break;
            default:
                break;
        }
        currentAngle[0] = Math.max(Math.min(currentAngle[0] + dy, 90.0), -90.0);
        currentAngle[1] = currentAngle[1] + dx;

        // deal with modelMatrix
        that.setModelNormal();

        that.dealLngLat();

        // that.updateSence();
    });

    window.addEventListener('resize', () => {
        that.width = that.container.offsetWidth;
        that.height = that.container.offsetHeight;

        that.canvas.height = that.height;
        that.canvas.width = that.width;
        that.canvas.style.height = that.height + 'px';
        that.canvas.style.width = that.width + 'px';

        that.setPerspective();
        that.gl.viewport(0, 0, that.canvas.width, that.canvas.height);   
        that.scene.setCanvasWidthHeight(that.canvas.width, that.canvas.height);
        
        if(that.haloLayer) {
            that.haloLayer.resize();
        }
        
        // that.updateSence();
    });

    // // just for test
    // that.canvas.addEventListener('contextmenu', (e) => {
    //     const event = e ? e : window.event;
    //     if (event.preventDefault) event.preventDefault();  //标准 
    //     if (event.returnValue) event.returnValue = false;  //IE 
    //     if (event.stopPropagation) event.stopPropagation();
    //     if (event.cancelBubble) event.cancelBubble = true;
    //     const x = event.clientX;
    //     const y = event.clientY;
    //     const points = that.scene.queryReactableGeometries(x, y, 'labelImgLayer');
    //     if (points.length) {
    //         console.log(points);
    //     }
    // });
}

let zooming = false;
let startTime = Date.now();
let oldZoom = 0;
let unitZoom = 0;

function startZoom(num) {
    if (!zooming) {
        zooming = true;
        startTime = Date.now();
        oldZoom = this.getZoom();
        unitZoom = num / 100;
        requestAnimationFrame(zoom.bind(this));
    }
}

function zoom() {
    const time = Date.now();
    const count = time - startTime;
    if (count >= 100) {
        zooming = false;
        let newZoom = oldZoom + unitZoom * 100;
        if (newZoom > 7.75) {
            newZoom = 7.75;
        }
        else if (newZoom < 1.5) {
            newZoom = 1.5;
        }
        this.setZoom(newZoom);
    }
    else {
        let newZoom = oldZoom + unitZoom * count;
        if (newZoom > 7.75) {
            newZoom = 7.75;
        } else if (newZoom < 1.5) {
            newZoom = 1.5;
        }
        this.setZoom(newZoom);
        requestAnimationFrame(zoom.bind(this));
    }
}

